@import "variables";

@mixin img-box($width: 100%, $height: 100%, $border: 10px, $margin: 10px) {
  height: $height;
  width: $width;
  border-radius: $border;
  margin-right: $margin;
  //margin-bottom: $margin;
  img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    border-radius: $border;
  }
}

@mixin img-box-gallery($width: 100%, $height: 100%, $border: 10px, $margin: 10px) {
  height: $height;
  width: $width;
  border-radius: $border;
  margin-right: $margin;
  //margin-bottom: $margin;
  img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    border-radius: $border;
  }
}

@mixin avatar-img-box($width, $height) {
  @include img-box($width, $height, 50%);
  background: url("@/assets/default_avatar.png") no-repeat center / contain;
}

@mixin cover-img-box($width, $height) {
  @include img-box($width, $height, $card-radius);
}
